<div class="row animate fadeIn">
    <form class="form-horizontal" id="mom_upd_form">
    <div class="ibox-title" style="border:none;"><h5 style="color: #00afef"><i>Edit</i></h5>
        <div class="ibox-tools">    
             <button class="btn btn-primary btn-sm save-btn-tab" id="submit_mom_e">Save</button>
             <a id="cancel_add" class="btn btn-sm btn-outline btn-info cancel-btn-tab">Cancel</a>
        </div>
     </div>
     <div class="ibox-content">
        <?php foreach($mm_data as $data){ ?>
            <input type="hidden" name="e_hidden_id" value="<?php echo $data->mmeter_id; ?>" >
            <div class="form-group">
                <label class="col-lg-3 control-label">Mother Meter Name</label>
                    <div class="col-lg-5">
                        <input type="text" id=""class="form-control" name="e_mm_name" value="<?php echo $data->mother_name; ?>">
                    </div>
             </div>
             <div class="form-group">
                <label class="col-lg-3 control-label">Model</label>
                    <div class="col-lg-5">
                        <input type="text" id=""class="form-control" name="e_mm_model" value="<?php echo $data->mother_model; ?>">
                    </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Serial  Number</label>
                  <div class="col-lg-5">
                        <input type="text" id=""class="form-control" name="e_mm_serial" value="<?php echo $data->mother_serial; ?>">
                  </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Description</label>
                <div class="col-lg-5">
                    <textarea id=""class="form-control" name="e_mm_desc" value="<?php echo $data->description; ?>" ><?php echo $data->description; ?></textarea>
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Initial Reading</label>
                <div class="col-lg-5">
                    <input id=""class="form-control" name="e_mm_init" value="<?php echo $data->initial_reading; ?>" >
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Latitude</label>
                <div class="col-lg-5">
                    <input type="text" id="e_mmlat" class="form-control" name="e_mm_lat" value="<?php echo $data->loc_latitude; ?>" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Longitude</label>
                <div class="col-lg-5">
                    <input type="text" id="e_mmlng" class="form-control" name="e_mm_lng" value="<?php echo $data->loc_longitude; ?>" readonly>
                </div>
            </div>
            <div class="form-group">
              <label class="col-lg-3 control-label">Pick Location</label>
              <div class="col-lg-6">
                  <div id="map_wrapper" style="height: 300px;">
                      <div id="map_canvas2" class="mapping" style="width: 100%;height: 100%;">
                      </div>
                  </div>
              </div>
            </div>
          <?php } ?>
      </div>
    </form>
    
 </div>
 <script>
    $(document).ready(function(){
    $('#mom_upd_form').data('serialize',$('#mom_upd_form').serialize());
    $('#add_locator_sched').hide();
    $(".chosen-select").chosen({width:"100%;"}); 
    var markers =[];
    initialize();
    

        function initialize() {
          var current=new google.maps.LatLng($('#e_mmlat').val(),$('#e_mmlng').val());
           var mapProp = {
            center:new google.maps.LatLng(8.397371738287157,124.5965675264597),
            zoom:17,
            mapTypeId:google.maps.MapTypeId.SATELITE
          };
          var map=new google.maps.Map(document.getElementById("map_canvas2"),mapProp);
            google.maps.event.addDomListener(window, 'load', initialize);
         
          if($('#e_mmlat').val() != 0 || $('#e_mmlng').val() != 0){
                       var marker=new google.maps.Marker({
                          position:current,
                          });
                        markers.push(marker);
                        marker.setMap(map);
                        map.panTo(current);
                    }

          map.addListener('click', function(e) {
            placeMarkerAndPanTo(e.latLng, map);
          });  
        // Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
        }


        function placeMarkerAndPanTo(latLng, map) {
          DeleteMarkers();
          var marker = new google.maps.Marker({
            position: latLng,
            map: map
          });
          map.panTo(latLng);

          markers.push(marker);
          $('#e_mmlat').val(latLng.lat());
          $('#e_mmlng').val(latLng.lng());

        }


        function DeleteMarkers() {
        //Loop through all the markers and remove
            for (var i = 0; i < markers.length; i++) {
                markers[i].setMap(null);
            }
            markers = [];
        }





      $('#mom_upd_form').validate({
        rules :{
            e_mm_name:{
                required: true
            },
            e_mm_model:{
                required: true
            },
            e_mm_serial:{
                required: true
            },
            e_mm_init:{
                required: true
            }
        },submitHandler: function(form){
          dataString = $("#mom_upd_form").serialize();
          $.ajax({
            type: "POST",
            url: "<?php echo base_url($this->session->userdata('forajax').'/update_mom_meter'); ?>",
            data: dataString,
            dataType: 'json',
          success: function(data){
            if(data[0].error == 1){
                notifymsg("danger",data[0].msg);
                
            }else{
                notifymsg("success",". . .Mother Meter Updated Successfully");
                $('#mom_upd_form').data('serialize',$('#mom_upd_form').serialize());
            }
          },
          beforeSend: function(){
                $('#submit_mom_e').attr('disabled',true);
          },
          complete: function(data) {
                 $('#submit_mom_e').removeAttr('disabled');
          }      
         });   
        }
      });






      function alert_cancel(){
            if($('#mom_upd_form').serialize()!=$('#mom_upd_form').data('serialize')){
                swal({
                    title: "Are you sure?",
                    text: "Your work will not be save",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Leave",
                    cancelButtonText: "Stay",
                    closeOnConfirm: true,
                    closeOnCancel: true },
                function (isConfirm) {
                    if (isConfirm) {
                        close_edit(); active_search();
                        notifymsg("hide","hide");
                    } else {
                        swal("Cancelled");
                    }
                });
                }else{
                close_edit(); active_search();
                notifymsg("hide","hide");
            }
        } 
        $('#cancel_add').click(function () {          
            alert_cancel();
          
        });


      $('#editX').click(function(){
            alert_cancel();      
       });
    });
 </script>  